﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JWPlayerDemo.aspx.cs" Inherits="WebAppDemo.JWPlayerDemo" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
   
    <script type="text/javascript" src="./jwplayer/jwplayer.js"></script>
    
</head>
<body>
    <form id="form1" runat="server">
        <div id="myElement" style="width: 1000px; background-color: red;">Loading the player...</div>
        <ul>
<%--            <li onclick='jwplayer().play()'>Start playback</li>--%>
<%--            <li onclick='alert(jwplayer().getVolume())'>Get audio volume</li>--%>
<%--            <li onclick='jwplayer().setVolume(100)'>set audio volume</li>--%>
<%--            <li onclick='jwplayer().resize(800,1000);'>resize audio</li>--%>
<%--            <li onclick='jwplayer().seek(25);'>set seek audio</li>--%>
<%--            <li onclick='SepcPlay();'>指定位置播放</li>--%>
            <li onclick="setSize();">动态JS设置大小</li>
            <li onclick="GetPlayerState();">获取Player State</li>
        </ul>
        <script type="text/javascript">
            jwplayer("myElement").setup({
                playlist: [{
                    file: 'http://210.51.187.34/video/abc.flv',
                    //'http://www.ad.siemens.com.cn/service/elearning/video/abc.mp4',//'http://www.elearning.siemens.com.cn/video/Course/0000/fh7kad1bdef5b4ha8j0.flv',
                    //'http://www.ad.siemens.com.cn/service/elearning/video/abc.mp4',
                    //"./video/4-5.flv",
                    image: "./Image/Chrysanthemum.jpg",
                    tracks: [{
                        file: "./video/4-5-Text.vtt",//"",//vtt必须是Utf-8
                        kind: 'chapters'//,//captions 必须和 label=“On”连用,chapters
                        //label: "On"
                    }],
                    title: "Sintel Movie Trailer",
//                                seek:100,
                               
//                                aspectratio: "12:5"
                }],
                width: "400",
                height: "300",
//                primary: "flash"
            });
//            function SepcPlay() {
//                jwplayer().play();
//                jwplayer().seek(55);
//            }
//            //控制音量
//            jwplayer().onVolume(function (event) {
//                alert('the volume is now: ' + event.volume);
//            });
            //
//                        var i = 0;
//            //从指定位置播放
//               jwplayer().onBeforePlay(function (event) {
//                   if (i == 0) {
//                       jwplayer().seek(20);
////                    setTimeout("", 1000);
//                    i = 1;
//                }
//            });
            
            //在列表中从指定的位置播放
//            jwplayer().onPlay(function (event) {
//                    setTimeout("jwplayer().seek(55);", 1000);
//            });
            
            //加载视频列表
//            jwplayer("myElement").setup({
//                playlist: "video/test.rss"
            //            }); 
            //单个视频
//            jwplayer("myElement").setup({
//                file: 'http://www.ad.siemens.com.cn/service/elearning/video/abc.mp4',
//                //'http://content.bitsontherun.com/videos/i8oQD9zd-kNspJqnJ.mp4',//"./video/4-5.flv"//'./video/fh7kad1bdef5b4ha8j0.flv',
//                height: 360,
//                image: "/Image/Chrysanthemum.jpg",
//                width: 640
//            });
            //下载视频
//            jwplayer().addButton(
//                "/uploads/myButton.png",
//                "Download Video",
//                function () {
//                    window.location.href = jwplayer().getPlaylist()[0].sources[0].file;
//                },
//                "download"
//            );

            //show listbar
//            jwplayer("myElement").setup({
//                playlist: [{
//                    file: "video/4-5.flv",
//                    image: "http://content.bitsontherun.com/thumbs/3XnJSIm4-640.jpg",
//                    title: "Sintel Trailer",
//                    description: "Sintel is a fantasy CGI movie from the Blender Open Movie Project.",
//                }
//                    , {
//                    file: "http://content.bitsontherun.com/videos/i8oQD9zd-kNspJqnJ.mp4",
//                    image: "http://content.bitsontherun.com/thumbs/i8oQD9zd-640.jpg",
//                    title: "Tears of Steel Trailer",
//                    description: "A complete open pipeline was used to produce this visual effect film."
//                }, {
//                    file: "http://content.bitsontherun.com/videos/bkaovAYt-kNspJqnJ.mp4",
//                    image: "http://content.bitsontherun.com/thumbs/bkaovAYt-640.jpg",
//                    title: "Big Buck Bunny Trailer",
//                    description: "This  animated film is made using free and open source software."
//                }, {
//                    file: "http://content.bitsontherun.com/videos/kaUXWqTZ-kNspJqnJ.mp4",
//                    image: "http://content.bitsontherun.com/thumbs/kaUXWqTZ-640.jpg",
//                    title: "Elephants Dream Trailer",
//                    description: "This is the worlds first open movie, made entirely with Blender."
//                }
//                ],
//                width: 500,
//                height: 340,
////                primary: "flash",
//                listbar: {
//                    position: "bottom",
//                    size: 260
//                }
//            });
        </script>
    </form>
</body>
   
 
    <script type="text/javascript" src="AjaxPage/GenerateJS.ashx?CourseId=123>"></script>
    <script type="text/javascript">
        function GetPlayerState() {
//            alert(jwplayer().getState());
        }
       
//        function  OnInit() {
//            jwplayer.OnPause(function () {
//                alert("send info that this player is pausing");
//            }
//        );
        //}
        var playSec;
        jwplayer().onPause(function () {
            saveSeek();
            if (playSec!=null) {
                window.clearTimeout(playSec);
            }
        });
        
        jwplayer().onPlay(function() {
            playSec=setInterval("saveSeek()", 10000);
            saveSeek();
        });

        function saveSeek() {
//            alert("position:"+jwplayer().getPosition());
        }
        

//      jwplayer.onBeforePlay(OnInit);
    </script>
</html>

